
<div class="arrow"> <a class="arrow-left" href="#"></a> <a class="arrow-right" href="#"></a> </div>
<div class="swiper-container">
  <div class="swiper-wrapper">
    {volist name="banners" id="ba" offset="0" length="5" empty=""}
    <div class="swiper-slide slide_pic"><a href="{$ba.url}"><img src="{$ba.image}"></a></div>
    {/volist}
    <!-- <div class="swiper-slide slide_pic"> <img src="__STATIC__/home/images/banner_02.jpg"> </div> -->
    <!-- <div class="swiper-slide slide_pic swiper-slide-visible swiper-slide-active"> <img src="__STATIC__/home/images/banner_03.jpg"> </div> -->
  </div>
  <div class="pagination">
    <span class="swiper-pagination-switch"></span>
    <span class="swiper-pagination-switch"></span>
    <span class="swiper-pagination-switch swiper-visible-switch swiper-active-switch"></span>
  </div>
</div>